<!-- 反馈意见 Create by liu 2021/5/32 -->
<template>
  <div class="main_box">
    <div class="add_wrap">
        <div class="tit">
            <h2>意 见 反 馈</h2>
            <el-button plain size="small" type="success" icon="fa fa-mail-forward" @click="returnList"> 返 回</el-button>
        </div>
        <el-form :model="dataForm" ref="dataForm" label-width="200px" :rules="roleRules">
            <el-row>
                <el-form-item label="反馈类型" prop="adviceType">
                    <el-select v-model="dataForm.adviceType" placeholder="请选择反馈类型" @change="typeChange">
                        <el-option
                         v-for="item in adviceTypeList"
                         :key="item.value"
                         :value="item.value"
                         :label="item.label">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="名字" prop="linkName" >
                    <el-input v-model="dataForm.linkName" @change="nameChange" clearable ></el-input>
                </el-form-item>

                <el-form-item label="反馈内容" prop="content">
                    <el-input
                        placeholder="请输入内容"
                        v-model="dataForm.content"
                        type="textarea"
                        autosize>
                        </el-input>
                </el-form-item>
            </el-row>

            <el-row>
                <el-form-item>
                    <el-button plain type="primary" :disabled="submitDisabled" @click="sureClick">提 交</el-button>
                    <el-button @click="returnList">取 消</el-button>
                </el-form-item>
            </el-row>

        </el-form>

    </div>

  </div>
</template>

<script>
import * as message from "@/constants/message";
import UserApi from "@/api/user/user";

export default {
 data() {
     return {
        dataForm:{
             adviceId: "",
             content: "",
             adviceType: "",
             linkName: "",
        },
        submitDisabled:false, // 初始状态下可以提交
        adviceTypeList: [
            { label: '我的贡献', value: '1' },
            { label: '他人亮点', value: '2' },
            { label: '发现问题', value: '3' },
            { label: '我的建议', value: '4' },
            { label: '其他', value: '5' }
        ],

        roleRules:{
            content: [
                { required: true, message: "请输入内容", trigger: "blur" },
                 { max: 200, message: '长度不超过200个字', trigger: 'blur' }
             ],
            adviceType: [
                { required: true, message: "请选择反馈类型", trigger: "blur" }
            ],
         },

     }
 },
  methods: {
    addData () {
        let _this = this
        UserApi.addCompanyAdvice(this.dataForm)
         .then((res) => {
             _this.$Utils.notifySuccess()
            this.returnList();
         })
    },
    sureClick () {
        this.$refs.dataForm.validate(valid => {
            if(valid){
            this.$confirm(message.MSG_CONFIRM_SUBMIT_APPLICATION, message.TITLE_PROMPT, {})
                .then(() => {
                    this.addData();
                });
            }
        });

    },
    typeChange (val) {
        // 监听到type等于二时，禁用提交按钮，且提醒名字不能为空
        if (val == 2 && !this.linkName){
            this.$message.warning(`反馈他人亮点时，需输入他人姓名`)
            this.submitDisabled = true
        } else if (val !== 2){
            this.submitDisabled = false
        }
    },
    nameChange (value) {
        if(value) {
            this.submitDisabled = false
        }
    },
    returnList () {
      this.$store.dispatch('delView', this.$route);
      this.$router.push({ path:'/user/companyAdviceManagement'})
    //   this.$router.go(-1);
    }
  },


}
</script>

<style lang="scss" src="@/assets/css/views/add.scss" scope>
</style>
